
// $(function () {
//   videojs('my-live', {
//     sources: [{
//       src: 'rtmp://www.bestqd.cn/live/rtmp',
//       type: 'rtmp/flv'
//     }],
//     techOrder: ['flash'],
//     autoplay: true,
//     controls: false,
//   });
// })

$(function () {
  var Hls = window.Hls
  var video = document.querySelector('video')
  // var url = 'https://txy.wshls.acgvideo.com/live-txy/224449/live_4392022_3013245.m3u8?wsSecret=6f2d87785796a382cea802668e788cb6&wsTime=1527930093'
  var url = 'https://www.bestqd.cn/hls/stream.m3u8'

  // if(/UIWebView Device/i.test(navigator.userAgent)) {
    // $('.live-video-controller').hide()
    // var video_html = '<video width="100%" height="100%" webkit-playsinline="true" preload="auto" poster="http://avatar.wpn.itlukai.com/poster.jpg"><source type="video/mp4" src='+ url +'></video><button class="vjs-big-play-button" type="button" aria-live="polite" title="Play Video" aria-disabled="false"><span aria-hidden="true" class="vjs-icon-placeholder"></span><span class="vjs-control-text">Play Video</span></button>'
    // $('.video-box').html(video_html)
    // $('.player-video').on('click', function () {
    //   video.play()
    //   $('.live-video-controller').show()
    //   $('.vjs-big-play-button').hide()
    // })
  // }
  
  // if (Hls.isSupported()) {
  //   var hls = new Hls()
  //   hls.loadSource(url)
  //   hls.attachMedia(video)
  //   hls.on(Hls.Events.MANIFEST_PARSED, function () {
  //     // video.play()
  //   })
  // } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
    // $('.live-video-controller').hide()
    // var video_html = '<video width="100%" height="100%" webkit-playsinline="true" preload="auto" poster="http://avatar.wpn.itlukai.com/poster.jpg"><source type="video/mp4" src='+ url +'></video><button class="vjs-big-play-button" type="button" aria-live="polite" title="Play Video" aria-disabled="false"><span aria-hidden="true" class="vjs-icon-placeholder"></span><span class="vjs-control-text">Play Video</span></button>'
    // $('.video-box').html(video_html)
    // $('.player-video').on('click', function () {
    //   video.play()
    //   $('.live-video-controller').show()
    //   $('.vjs-big-play-button').hide()
    // })

    // $('.live-video-controller').hide()
    // var video_btn = '<button class="vjs-big-play-button" type="button" aria-live="polite" title="Play Video" aria-disabled="false"><span aria-hidden="true" class="vjs-icon-placeholder"></span><span class="vjs-control-text">Play Video</span></button>'
    // $('.video-box').append(video_btn)
  //   video.src = url
  //   video.addEventListener('loadedmetadata', function () {
  //     video.play()
  //   })
  // }

  
  $('.player-video').on('click', '.live-video-controller-start-btn', function () {
    $(this).find('.blpui-btn').toggleClass('show')
    var status = $(this).attr('status')
    if(status == 1) {
      $(this).attr('status', 0)
      video.pause()
    } else {
      $(this).attr('status', 1)
      video.play()
    }
  })

  var volume_val = 0.75
  $('.blpui-volume-btn').click(function () {
    $(this).find('.blpui-btn').toggleClass('show')
    var status = $(this).attr('status')
    if(status == 1) {
      video.volume = 0
      $(this).attr('status', 0)
      $('.blpui-slider-span').removeClass("slider-span-active")
    } else {
      video.volume = volume_val
      $(this).attr('status', 1)
      $('.blpui-slider-span').slice(0, Math.round(volume_val/0.125)).addClass("slider-span-active")
    }
  })

  $('.blpui-slider-span').click(function () {
    $(this).add($(this)).siblings().removeClass("slider-span-active")
    $(this).add($(this)).prevAll().addClass("slider-span-active")
    video.volume = volume_val = 0.125 * ($(this).index() + 1)
  })

  $('.blpui-slider-span').hover(function () {
    $(this).addClass("blpui-slider-hover").siblings('.blpui-slider-span').removeClass("blpui-slider-hover")
  }, function () {
    $('.blpui-slider-span').removeClass("blpui-slider-hover")
  })
  
  $('.player-video').on('click', '.live-video-controller-fullscreen-btn', function () {
    $(this).find('.blpui-btn').toggleClass('show')
    var status = $(this).attr('status')
    if(status == 1) {
      $(this).attr('status', 0)
      requestFullScreen(video)
    } else {
      $(this).attr('status', 1)
      cancelFullscreen(video)
    }
  })


  function requestFullScreen(el) {
    if(el.requestFullscreen) {
      el.requestFullscreen();
    } else if(el.mozRequestFullScreen) {
      el.mozRequestFullScreen();
    } else if(el.webkitRequestFullscreen) {
      el.webkitRequestFullscreen();
    } else if(el.msRequestFullscreen) {
      el.msRequestFullscreen();
    }
  }

  function cancelFullscreen(el) {
    if(el.requestFullscreen) {
      el.cancelFullscreen();
    } else if(el.mozCancelFullScreen) {
      el.mozCancelFullScreen();
    } else if(el.webkitCancelFullscreen) {
      el.webkitCancelFullScreen();
    } else if(el.msCancelFullscreen) {
      el.msCancelFullscreen();
    }
  }

})











